<script setup>
import {ref} from 'vue'
// vue2中this.$refs[] 去拿ref数据对象
// 1.创建空白的ref
const hRef = ref(null)

// 3.使用ref
// 注意: 使用或打log查看ref获取到的dom或组件需要在onMounted生命周期中使用
const clickFn = () => {
  console.log('dom上绑定的ref', hRef)
  hRef.value.innerText = '我是js原生方法设置的标题'
}
</script>

<template>
  <div class="ref-page">
    <!-- 2. 在模板里简历联系 -->
    <h1 ref="hRef">我是个标题</h1>
    <button @click="clickFn">操作dom</button>
  </div>
</template>

<style scoped></style>
